<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html lang = "en">
<head>
    <meta charset = "utf-8"/>
    <title>Modify</title>
    <meta name = "viewport" content = "width=device-width, initial-scale=1.0"/>
    <meta name = "description" content = ""/>
    <meta name = "author" content = "stilearning"/>

    <!-- google font -->
    <!--<link href="http://fonts.googleapis.com/css?family=Aclonica:regular" rel="stylesheet" type="text/css" />-->

    <!-- styles -->
    <link href = "css/bootstrap.css" rel = "stylesheet"/>
    <link href = "css/bootstrap-responsive.css" rel = "stylesheet"/>
    <link href = "css/stilearn.css" rel = "stylesheet"/>
    <link href = "css/stilearn-responsive.css" rel = "stylesheet"/>
    <link href = "css/stilearn-helper.css" rel = "stylesheet"/>
    <link href = "css/stilearn-icon.css" rel = "stylesheet"/>
    <link href = "css/animate.css" rel = "stylesheet"/>
    <link href = "css/uniform.default.css" rel = "stylesheet"/>

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
    <script src = "http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <meta http-equiv = "Content-Type" content = "text/html; charset=utf-8"/>
</head>

<body>
<!-- section header -->
<header class = "header" data-spy = "affix" data-offset-top = "0">
    <!--nav bar helper-->
    <div class = "navbar-helper">
        <div class = "row-fluid">
            <!--panel site-name-->
            <div class = "span9">
                <div class = "panel-sitename">
                    <h2><a href = "index.html"><span class = "color-teal">RSC</span>-System</a></h2>
                </div>
            </div>
            <!--/panel name-->
        </div>
    </div>
    <!--/nav bar helper-->
</header>

<!-- section content -->
<section class = "section">
    <div class = "container">
        <div class = "signin-form row-fluid">
            <!--Sign In-->
            <!--/Sign In-->
            <!--Sign Up-->
            <div class = "span5 offset3">
                <div class = "box corner-all">
                    <div class = "box-header grd-orange color-white corner-top">
                        <span>修改个人信息</span>
                    </div>
                    <div class = "box-body bg-white">
                        <form action="modifyUserInfo" method = "post"/>
                        <!--  <div class = "control-group">
                            <label class = "control-label">ID</label>

                            <div class = "controls">
                                <input type = "text" class = "input-block-level"
                                       data-validate = "{required: true, messages:{required:'Please enter field username'}}" name = "userid"
                                       id = "userid" autocomplete = "off"/>

                                <p class = "help-block muted helper-font-small"></p>
                            </div>
                        </div>-->
                        <div class = "control-group">
                            <label class = "control-label">姓名</label>

                            <div class = "controls">
                                <input type = "text" class = "input-block-level"
                                       data-validate = "{required: true, messages:{required:'Please enter field username'}}"
                                       name = "username" id = "username" autocomplete = "off"/>

                                <p class = "help-block muted helper-font-small"></p>
                            </div>
                        </div>
                        <div class = "control-group">
                            <label class = "control-label">联系电话</label>

                            <div class = "controls">
                                <input type = "text" class = "input-block-level"
                                       data-validate = "{required: true, number:true, messages:{required:'Please enter field tel', email:'Please enter a valid tel'}}"
                                       name = "tel" id = "tel" autocomplete = "off"/>

                                <p class = "help-block muted helper-font-small"><strong></strong></p>
                            </div>
                        </div>
                        <div class = "control-group">
                            <label class = "control-label">Email</label>

                            <div class = "controls">
                                <input type = "text" class = "input-block-level"
                                       data-validate = "{required: true, number:true, messages:{required:'Please enter field email', email:'Please enter a valid email'}}"
                                       name = "email" id = "email" autocomplete = "off"/>

                                <p class = "help-block muted helper-font-small"><strong></strong></p>
                            </div>
                        </div>
                        <div class = "control-group">
                            <label class = "control-label">密码</label>

                            <div class = "controls">
                                <input type = "password" class = "input-block-level"
                                       data-validate = "{required: true, minlength: 6, messages:{required:'Please enter field password', minlength:'Please enter at least 6 characters.'}}"
                                       name = "password" id = "password" autocomplete = "off"/>

                                <p class = "help-block muted helper-font-small">建议长度大于6位</p>
                            </div>
                        </div>
                        <div class = "control-group">
                            <label class = "control-label">重复密码</label>

                            <div class = "controls">
                                <input type = "password" class = "input-block-level"
                                       data-validate = "{required: true, equalTo: '#password', messages:{required:'Please enter field confirm password', equalTo: 'confirmation password does not match the password'}}"
                                       name = "password_again" id = "password_again" autocomplete = "off"/>

                                <p class = "help-block muted helper-font-small">请再次输入密码</p>
                            </div>
                        </div>


                        <div class = "form-actions">
                            <input type = "submit" class = "btn btn-block btn-large btn-warning" value = "确认"/>
                        </div>
                        </form>
                    </div>
                </div>
            </div>
            <!--/Sign Up-->
        </div>
        <!-- /row -->
    </div>
    <!-- /container -->

    <!-- modal recover -->
    <div id = "modal-recover" class = "modal hide fade" tabindex = "-1" role = "dialog" aria-labelledby = "modal-recoverLabel"
         aria-hidden = "true">
        <div class = "modal-header">
            <button type = "button" class = "close" data-dismiss = "modal" aria-hidden = "true">&times;</button>
            <h3 id = "modal-recoverLabel">Reset password
                <small>Username Or Email Address</small>
            </h3>
        </div>
        <div class = "modal-body">
            <form id = "form-recover" method = "post"/>
            <div class = "control-group">
                <div class = "controls">
                    <input type = "text"
                           data-validate = "{required: true, email:true, messages:{required:'Please enter field email', email:'Please enter a valid email address'}}"
                           name = "recover"/>

                    <p class = "help-block helper-font-small">Enter your username or email address and we will send you a link to reset your
                                                              password.</p>
                </div>
            </div>
            </form>
        </div>
        <div class = "modal-footer">
            <button class = "btn" data-dismiss = "modal" aria-hidden = "true">Close</button>
            <input type = "submit" form = "form-recover" class = "btn btn-primary" value = "Send reset link"/>
        </div>
    </div>
    <!-- /modal recover-->
</section>

<!-- javascript
================================================== -->
<!--<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>-->
<script src = "js/jquery.js"></script>
<script src = "js/bootstrap.js"></script>
<script src = "js/uniform/jquery.uniform.js"></script>

<script src = "js/validate/jquery.metadata.js"></script>
<script src = "js/validate/jquery.validate.js"></script>

<script type = "text/javascript">
    $(document).ready(function () {
        // try your js

        // uniform
        $('[data-form=uniform]').uniform();

        // validate
        $('#sign-in').validate();
        $('#sign-up').validate();
        $('#form-recover').validate();
    })
</script>
</body>
</html>
